<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="copyright" content="Copyright (c) IBM Corporation and others 2013, 2017." >
<meta http-equiv="Content-Language" content="en-us">
<title>Orion Editor Snippet</title>

<style>
#myEditor {
	border: 1px solid #ddd;
	position: relative;
	width: 100%;
	height: 400px;
}

textarea {
	width: 100%;
	height: 100%;
}
</style>

<link rel="stylesheet" type="text/css" href="http://eclipse.org/orion/editor/releases/latest/built-editor.css"/>
<script src="http://eclipse.org/orion/editor/releases/latest/built-editor.js"></script>
<script src="http://eclipse.org/orion/editor/releases/latest/stylers/text_x-yaml/syntax.js"></script>

<script>
	/*eslint-env browser, amd*/
	require(["orion/editor/edit"], function(edit) {
		var editor = edit({contentType: "text/x-yaml", parent: "myEditor"});
		editor.setSelection(33, 43);
	});
</script>
</head>
<body spellcheck="false">
<h2>YAML snippet</h2>
This snippet shows how to use the YAML syntax highlighter.
<br>
<br>
<div id="myEditor"><textarea>
invoice: 34843
date   : 2001-01-23
bill-to: &id001
    given  : Chris
    family : Dumars
    address:
        lines: |
            458 Walkman Dr.
            Suite #292
        city    : Royal Oak
        state   : MI
        postal  : 48046
ship-to: *id001
product:
    - sku         : BL394D
      quantity    : 4
      description : Basketball
      price       : 450.00
    - sku         : BL4438H
      quantity    : 1
      description : Super Hoop
      price       : 2392.00
tax  : 251.42
total: 4443.52
comments: &gt;
    Late afternoon is best.
    Backup contact is Nancy
    Billsmer @ 338-4338.
</textarea></div>
</body>
</html>
